
function ChartPositionList() {
	var pathList = $("path");
	pathList.each(function() {
		var targetid = $(this).attr("id");
		ChartPosition(targetid);
	});
}

function CreateChart(chartsType, targetid, dataarray) {
	Config();
	var chartid = targetid + "chart";
	var chartBox = null;
	chartBox = $("#map").find("#" + chartid);
	if (typeof (chartBox[0]) != "undefined") {
		chartBox[0].remove();
	}
	var map = $("#map");
	var boardDiv = "<div id='" + chartid + "' class='chartClass'>" + chartid
			+ "<\/div>";
	map.append(boardDiv);
	ChartPosition(targetid);

	switch (chartsType) {
	case "pie": {
		Pie(chartid, dataarray);// 鏁版嵁宸瞝ist鏂瑰紡浼犺繘鏉ュ悗锛屽皢dataarray鏀逛负List銆恑銆�
		break;
	}
	case "chord": {
		Chord(chartid);
		break;
	}
	}

}

function ChartPosition(targetid) {
	var chartid = targetid + "chart";
	var chartBox = null;
	chartBox = $("#" + chartid);
	if (chartBox == null || typeof (chartBox[0]) == "undefined") {
		return;
	}
	var svgElement = document.getElementById('SvgElement');
	var svgPoint = svgElement.createSVGPoint();
	
	var sx = 0, sy = 0;
	var e = svgElement;
	while (e != null) {
		sx += e.offsetLeft;
		sy += e.offsetTop;
		e = e.offsetParent;
	}
	
	var circle = $("#" + targetid);
	svgPoint.x = circle.attr("cx");
	svgPoint.y = circle.attr("cy");
	var screenPoint = trans(svgPoint, svgElement);
	screenPoint.x+=sx-svgElement.getBoundingClientRect().left;
	screenPoint.y+=sy-svgElement.getBoundingClientRect().top;

	if (screenPoint.x > sx + parseFloat($("#SvgElement").css("width"))
			|| screenPoint.x < sx
			|| screenPoint.y > sy + parseFloat($("#SvgElement").css("height"))
			|| screenPoint.y < sy) {
		chartBox.hide();
		return;
	}
	chartBox.show();
	var width = parseFloat(chartBox.css("width"));
	var height = parseFloat(chartBox.css("height"));
	var left = screenPoint.x - width / 2;
	var top = screenPoint.y - height / 2;
	var str = "position:absolute;left:" + left + "px;top:" + top + "px;";
	chartBox[0].setAttribute("style", str);
}

function Config() {
	// 璺緞閰嶇疆
	require.config({
		paths : {
			'echarts' : 'echarts',
			'echarts/chart/bar' : 'echarts'
		}
	});
}

function Chord(chartid) {

	// 浣跨敤
	require([ 'echarts', 'echarts/chart/chord' // 浣跨敤鏌辩姸鍥惧氨鍔犺浇bar妯″潡锛屾寜闇�姞杞�
	], function(ec) {
		// 鍩轰簬鍑嗗濂界殑dom锛屽垵濮嬪寲echarts鍥捐〃
		var myChart = ec.init(document.getElementById(chartid));

		var option = {
			tooltip : {
				trigger : 'item'
			},
			series : [ {
				type : 'chord',
				sort : 'ascending',
				sortSub : 'descending',
				showScale : true,
				showScaleText : false,
				radius : [ '25%', '30%' ],

				data : [ {
					name : 'group1'
				}, {
					name : 'group2'
				}, {
					name : 'group3'
				}, {
					name : 'group4'
				} ],
				itemStyle : {
					normal : {
						label : {
							show : false
						}
					}
				},
				matrix : [ [ 11975, 5871, 8916, 2868 ],
						[ 1951, 10048, 2060, 6171 ],
						[ 8010, 16145, 8090, 8045 ], [ 1013, 990, 940, 6907 ] ]
			} ]
		};

		// 涓篹charts瀵硅薄鍔犺浇鏁版嵁
		myChart.setOption(option);
	});
}

function Pie(chartid, dataArray) {
	// 浣跨敤
	require([ 'echarts', 'echarts/chart/pie' // 浣跨敤鏌辩姸鍥惧氨鍔犺浇bar妯″潡锛屾寜闇�姞杞�
	], function(ec) {
		// 鍩轰簬鍑嗗濂界殑dom锛屽垵濮嬪寲echarts鍥捐〃
		var myChart = ec.init(document.getElementById(chartid));
		option = {

			tooltip : {
				trigger : 'item',
				formatter : "{a} <br/>{b} : {c} ({d}%)"
			},

			calculable : true,

			series : [ {
				name : '璁块棶鏉ユ簮',
				type : 'pie',
				radius : 20,
				center : [ '50%', '50%' ],
				data : dataArray
			} ],

			itemStyle : {
				normal : {
					label : {
						show : false
					},
					labelLine : {
						show : false
					}
				},
				emphasis : {
					label : {
						show : true,
						position : 'outer'
					},
					labelLine : {
						show : true,
						lineStyle : {
							color : 'red'
						}
					}
				}
			}
		};

		// 涓篹charts瀵硅薄鍔犺浇鏁版嵁
		myChart.setOption(option);
	});
}